package com.caowj.composedemo.activity

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Favorite
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import com.caowj.composedemo.ui.theme.ComposeDemoTheme

/**
 * Button控件
 * https://blog.csdn.net/qq_41899289/article/details/120263064
 */
class ButtonActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            ComposeDemoTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colors.background
                ) {
                    ButtonDemo()
                }
            }
        }
    }
}

@Composable
fun ButtonDemo() {
    val btnValue = remember {
        mutableStateOf("点击此处")
    }
    val count = remember {
        mutableStateOf(0)
    }
    Column(modifier = Modifier.padding(all = 4.dp)) {               //状态栏高度间距
        //点击按钮
        Button(
            onClick = {
                count.value++
                btnValue.value = "点击了 ${count.value} 次"
            },
            modifier = Modifier
                .height(50.dp)
                .width(200.dp),                                     //修饰符
            enabled = true,                                           //是否启用
            elevation = ButtonDefaults.elevation(4.dp, 8.dp, 2.dp),    //按钮正视图高度，类似阴影这种效果，体现层次感
            shape = RoundedCornerShape(8.dp),                        //圆角
            border = BorderStroke(2.dp, Color.Magenta),                 //边框
            colors = ButtonDefaults.buttonColors(
                Color.Red,
                Color.Black,
                Color.Gray,
                Color.DarkGray
            ),    //背景
            contentPadding = ButtonDefaults.ContentPadding            //内容填充
        ) {
            Text(
                text = btnValue.value                              //文本内容
            )
        }

        //图标切换按钮
        val checkedState = remember { mutableStateOf(true) }

        IconToggleButton(
            checked = checkedState.value,
            onCheckedChange = {
                checkedState.value = it
            },
        ) {
            Icon(
                imageVector = Icons.Filled.Favorite,                //矢量图
                contentDescription = "收藏",
                tint = if (checkedState.value) {                    //色彩
                    Color.Red
                } else {
                    Color.Gray
                }
            )
        }
    }
}